<template>
  <div class="app-container">
    <div class="filter-container">
      <el-date-picker
        @keyup.enter.native="handleFilter"
        class="filter-item"
        size="small"
        :picker-options="pickerOptions1"
        value-format="yyyy-MM-dd"
        v-model="filters['startDate']"
        type="date"
        placeholder="选择开始日期（营业日）"
      ></el-date-picker>
      <el-date-picker
        @keyup.enter.native="handleFilter"
        class="filter-item"
        size="small"
        value-format="yyyy-MM-dd"
        :picker-options="pickerOptions1"
        v-model="filters['endDate']"
        type="date"
        placeholder="选择结束日期（营业日）"
      ></el-date-picker>
      <el-button
        class="filter-item"
        type="primary"
        size="small"
        v-waves
        icon="el-icon-search"
        @click="handleFilter"
      >搜索</el-button>
      <el-button
        class="filter-item"
        v-if="~accessable.indexOf('finance:notsettled_sum_export')"
        type="primary"
        size="small"
        v-waves
        icon="el-icon-document"
        @click="exportExcelFile"
      >导出</el-button>
    </div>
    <el-table
      :data="list"
      :height="tableHeight"
      @sort-change="sortChange"
      v-loading="listLoading"
      element-loading-text="给我一点时间"
      border
      fit
      highlight-current-row
      style="width: 100%"
    >
      <el-table-column prop="name" align="center" label="订单状态" width="140">
        <template slot-scope="scope">
          <span>{{scope.row.name}}</span>
        </template>
      </el-table-column>
      <el-table-column prop="totalAmount" align="center" label="订单总金额" width="140"></el-table-column>
      <!-- <el-table-column align="center" label="积分(含税)" width="120">
        <el-table-column align="center" prop="currentMonthPoints" label="当月积分" width="120"></el-table-column>
        <el-table-column align="center" prop="preMonthPoints" label="更早积分" width="120"></el-table-column>
      </el-table-column>-->
      <el-table-column align="center" label="积分数量" width="120">
        <el-table-column align="center" prop="currentMonthPointsCount" label="当月积分数量" width="120"></el-table-column>
        <el-table-column align="center" prop="preMonthPointsCount" label="更早积分数量" width="120"></el-table-column>
      </el-table-column>
      <el-table-column align="center" label="积分金额(含税)" width="120">
        <el-table-column align="center" prop="currentMonthPoints" label="当月积分金额" width="120"></el-table-column>
        <el-table-column align="center" prop="preMonthPoints" label="更早积分金额" width="120"></el-table-column>
      </el-table-column>
      <el-table-column align="center" label="微信(含税)">
        <el-table-column align="center" prop="currentMonthAmount" label="当月微信" width="120"></el-table-column>
        <el-table-column align="center" prop="preMonthAmunt" label="更早微信" width="120"></el-table-column>
      </el-table-column>
    </el-table>
    <div class="pagination-container">
      <el-pagination
        background
        @size-change="handleSizeChange"
        @current-change="handleCurrentChange"
        :current-page.sync="params.page"
        :page-sizes="[10,20,30, 50]"
        :page-size="params.limit"
        layout="total, sizes, prev, pager, next, jumper"
        :total="total"
      ></el-pagination>
    </div>
  </div>
</template>

<script>
import baseMixin from "../../mixins/baseMixin";
let statusMap = ["正常", "冻结"];
export default {
  mixins: [baseMixin],
  data() {
    return {
      total: 0,
      tableHeight: 500,
      keywords: "",
      startDate: "",
      params: {
        limit: 50
      },
      pickerOptions1: {
        disabledDate(time) {
          return time.getTime() > Date.now();
        },
        shortcuts: [
          {
            text: "今天",
            onClick(picker) {
              picker.$emit("pick", new Date());
            }
          },
          {
            text: "昨天",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24);
              picker.$emit("pick", date);
            }
          },
          {
            text: "一周前",
            onClick(picker) {
              const date = new Date();
              date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
              picker.$emit("pick", date);
            }
          }
        ]
      },
      endDate: "",
      rules: {}
    };
  },
  created() {
    this.tableHeight = window.innerHeight - 300;
    // this.handleFilter()
  },
  filters: {
    statusFilter(status) {
      return statusMap[parseInt(status)];
    },
    statusTagFilter(status) {
      return ["success", "danger"][parseInt(status)];
    }
  },
  methods: {
    handleFilter() {
      if (!this.filters.startDate) {
        this.$message.error("请选择开始日期");
        return;
      }
      if (!this.filters.endDate) {
        this.$message.error("请选择结束日期");
        return;
      }
      this.$post("/admin/finance_report/new_count_report", this.filters)
        .then(data => {
          this.list = data;
        })
        .catch(_ => {
          if (_.errcode === 2) {
            this.$message.error(_.msg);
          }
        });
    },
    exportExcelFile() {
      if (!this.filters.startDate) {
        this.$message.error("请选择开始日期");
        return;
      }
      if (!this.filters.endDate) {
        this.$message.error("请选择结束日期");
        return;
      }
      this.$post("/admin/finance_report/new_count_report/export", this.filters)
        .then(data => {
          this.openWin(data);
        })
        .catch(_ => {
          if (_.errcode === 2) {
            this.$message.error(_.msg);
          }
        });
    }
  }
};
</script>
